<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>校园骑士</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <script type="text/javascript" src="assets/js/jquery.min.js"></script>

   <!--  <link rel="stylesheet" href="assets/css/style.css"> -->
    <link rel="stylesheet" href="assets/css/loader-style.css">
    <link rel="stylesheet" href="assets/css/bootstrap.css">
    <link rel="stylesheet" href="assets/css/signin.css">

    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
        <!--<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>-->
        <![endif]-->
    <!-- Fav and touch icons -->
    <link rel="shortcut icon" href="assets/ico/minus.png">
</head>

<body>
    
    <div class="container">
        <div class="" id="login-wrapper">

            <div class="row">
                <div class="col-md-4 col-md-offset-4">
                    <div id="logo-login">
                        <h1>注册
                            <span>快递员</span>
                        </h1>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-4 col-md-offset-4">
                    <div class="account-box"> 
                        <form role="form" action="index.html">
                            <div class="form-group">
                                <!--a href="#" class="pull-right label-forgot">Forgot email?</a-->
                                <label for="phone">昵称：</label>
                                <input type="text" id="nickname" class="form-control" placeholder="用户个性昵称">
                                <div class="text-info" id="nameMsg"></div>
                            </div>

                            <div class="form-group">
                                <!--a href="#" class="pull-right label-forgot">Forgot email?</a-->
                                <label for="phone">手机号：</label>
                                <input type="text" id="phone" class="form-control" placeholder="填写手机号">
                                <div class="text-info" id="phoneMsg"></div>
                            </div>
							
							<div class="form-group">
                                <!--a href="#" class="pull-right label-forgot">Forgot email?</a-->
                                <label for="email">邮箱：</label>
                                <input type="text" id="email" class="form-control" placeholder="填写邮箱号" >
                                <div class="text-info" id="emailMsg"></div>
                            </div>

                            <!--<div class="form-group">-->
                                <!--<button class="btn btn btn-primary pull-right" >发送验证码</button>-->
                                <!--<input type="text" class="form-control" style="width:220px;">-->
                            <!--</div>-->

                            <div class="form-group">
                                <!--a href="#" class="pull-right label-forgot">Forgot password?</a-->
                                <label for="password">密码：</label>
                                <input type="password" id="password" class="form-control" placeholder="输入密码">
                                <div class="text-info" id="passwordMsg"></div>
                            </div>
							
							 <div class="form-group">
                                <!--a href="#" class="pull-right label-forgot">Forgot password?</a-->
                                <label for="re-password">确认密码：</label>
                                <input type="password" id="re-password" class="form-control" placeholder="再次输入密码">
                                <div class="text-info" id="infoHelp"></div>
                            </div>
							
							<div class="form-group">
								已有账号？现在去<a href="login.html">登录</a>
							</div>
							
                            <button class="btn btn btn-primary pull-right" type="button" id="submitBtn">
                                注册
                            </button>
                        </form>
                        
                        <div class="row-block">
	                        <div class="row"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--<div id="test1" class="gmap3"></div>-->
    <!--  END OF PAPER WRAP -->




    <!-- MAIN EFFECT -->
    <!--<script src="assets/js/preloader.js"></script>-->
    <script src="assets/js/bootstrap.js"></script>
    <!--<script src="assets/js/app.js"></script>-->
    <!--<script src="assets/js/load.js"></script>-->
    <!--<script src="assets/js/main.js"></script>-->

    <!--<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>-->
    <!--<script src="assets/js/map/gmap3.js"></script>-->
    <script>
        //注册的ajax请求
        $(function () {
            $("#nickname").on("blur",function () {
                var nicknameRegx=/^[A-Za-z\u4e00-\u9fa5]+$/;
                nickName = $("#nickname").val();
                if(nickName.length>20||nicknameRegx.exec(nickName)==null){
                    flag=false;
                    $("#nameMsg").html("<font color='red'>昵称必须在20字符以内且不包含数字</font>");
                }else {
                    flag=true;
                    $("#nameMsg").html("");
                }
            });

            $("#phone").on("blur",function () {
                var phoneRegx=new RegExp("^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\\d{8}$");
                if(!phoneRegx.test($("#phone").val())){
                    flag2=false;
                    $("#phoneMsg").html("<font color='red'>联系方式格式不正确！</font>");
                }else{
                    flag2=true;
                    $("#phoneMsg").html("");
                }
            });

            $("#email").on("blur",function () {
                var emailRegx=new RegExp("^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\\.[a-zA-Z0-9_-]+)+$");
                if(!emailRegx.test($("#email").val())){
                    flag3=false;
                    $("#emailMsg").html("<font color='red'>电子邮箱格式不正确！</font>")
                }else{
                    flag3=true;
                    $("#emailMsg").html("");
                }
            });

            $("#password").on("blur",function () {
                var passwordRegx=new RegExp("^[a-zA-Z0-9]{6,10}$");
                if(!passwordRegx.test($("#password").val())){
                    flag4=false;
                    $("#passwordMsg").html("<font color='red'>新密码必须为6~12位字符串</font>")
                }else{
                    flag4=true;
                    $("#passwordMsg").html("");
                }
            });

            $("#re-password").on("blur",function () {
                if($("#password").val() != $("#re-password").val()){
                    flag5=false;
                    $("#infoHelp").html("<font color='red'>原密码与确认密码不一致!</font>");
                }else{
                    flag5=true;
                    $("#infoHelp").html("");
                }
            });

            $("#submitBtn").on("click",function () {
                var nickname=$("#nickname").val();
                var phone = $("#phone").val();
                var email = $("#email").val();
                var password = $("#password").val();
                var repwd = $("#re-password").val();


                if(phone.length == 0|| password.length==0||email.length==0||nickname.length==0){
                    alert("输入信息不完整，请重试！");
                    return;
                }

                if(!flag||!flag2||!flag3||!flag4||!flag5){
                    return ;
                }

                $.post(sessionStorage.getItem("path_base")+"/api/register",
                {
                    "email":email,
                    "nickname":nickname,
                    "phone":phone,
                    "regPassword":password,
                    "type":"STAFF"
                },
                function (data) {
                    if(data != ""){
                        if(confirm("注册成功!是否跳转到登录界面？")==true){
                            window.location.href="login.html";
                        }
                    }
                });
            });

        });
    </script>


</body>

</html>